<!DOCTYPE html><html>
<head>
	<title>PhotoSwipe</title>
	<meta name="author" content="Code Computerlove - http://www.codecomputerlove.com/" />
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
	<link href="styles.css" type="text/css" rel="stylesheet" />
	
	<link href="../photoswipe.css" type="text/css" rel="stylesheet" />
	
	<script type="text/javascript" src="../lib/simple-inheritance.min.js"></script>
	<script type="text/javascript" src="../code-photoswipe-1.0.19.min.js"></script>
	
	
	<script type="text/javascript">
		
		// Set up PhotoSwipe with all anchor tags in the Gallery container 
		document.addEventListener('DOMContentLoaded', function(){
			
			Code.photoSwipe('a', '#Gallery');
			
		}, false);
		
		
		/* 
			Overview: 
			---------
			
			Code.photoSwipe(thumbnail-elements, container-element, options);
				
			When you specify a container-element, the helper uses event delegation
			to handle the click event, i.e. rather than having 50 click event listeners
			for each thumbnail, we have one for the container then try and deduce which
			thumbnail was clicked. If you omit a container, an event listener will be placed 
			on each individual thumbnail found.
			
			
			With options:
			-------------
			Code.photoSwipe('a', '#Gallery', { loop: false } );
			
			
			Using preselected elements:
			---------------------------
			var galleryEl = document.getElementById('Gallery');
			var thumbEls = galleryEl.querySelectorAll('a');
			
			Code.photoSwipe(thumbEls, galleryEl);
		
		*/
					
		
	</script>
	
</head>
<body>

<div id="Header">
	<a href="http://www.codecomputerlove.com"><img src="images/codecomputerlovelogo.gif" width="230" height="48" alt="Code Computerlove" /></a>
</div>

<div id="MainContent">

	<div class="page-content">
		<h1>PhotoSwipe</h1>
	</div>
	
	
	<div id="Gallery">
	
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/001.jpg"><img src="images/thumb/001.jpg" alt="Image 001" /></a></div>
			
			<div class="gallery-item"><a href="images/full/002.jpg"><img src="images/thumb/002.jpg" alt="Image 002" /></a></div>
			
			<div class="gallery-item"><a href="images/full/003.jpg"><img src="images/thumb/003.jpg" alt="Image 003" /></a></div>
			
		</div>

	
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/004.jpg"><img src="images/thumb/004.jpg" alt="Image 004" /></a></div>
			
			<div class="gallery-item"><a href="images/full/005.jpg"><img src="images/thumb/005.jpg" alt="Image 005" /></a></div>
			
			<div class="gallery-item"><a href="images/full/006.jpg"><img src="images/thumb/006.jpg" alt="Image 006" /></a></div>
	
		</div>
	
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/007.jpg"><img src="images/thumb/007.jpg" alt="Image 007" /></a></div>
			
			<div class="gallery-item"><a href="images/full/008.jpg"><img src="images/thumb/008.jpg" alt="Image 008" /></a></div>
			
			<div class="gallery-item"><a href="images/full/009.jpg"><img src="images/thumb/009.jpg" alt="Image 009" /></a></div>

		</div>
	
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/010.jpg"><img src="images/thumb/010.jpg" alt="Image 010" /></a></div>
			
			<div class="gallery-item"><a href="images/full/011.jpg"><img src="images/thumb/011.jpg" alt="Image 011" /></a></div>
			
			<div class="gallery-item"><a href="images/full/012.jpg"><img src="images/thumb/012.jpg" alt="Image 012" /></a></div>
	
		</div>
	
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/013.jpg"><img src="images/thumb/013.jpg" alt="Image 013" /></a></div>
			
			<div class="gallery-item"><a href="images/full/014.jpg"><img src="images/thumb/014.jpg" alt="Image 014" /></a></div>
			
			<div class="gallery-item"><a href="images/full/015.jpg"><img src="images/thumb/015.jpg" alt="Image 015" /></a></div>
	
		</div>
		
		<div class="gallery-row">
	
			<div class="gallery-item"><a href="images/full/016.jpg"><img src="images/thumb/016.jpg" alt="Image 016" /></a></div>
			
			<div class="gallery-item"><a href="images/full/017.jpg"><img src="images/thumb/017.jpg" alt="Image 017" /></a></div>
			
			<div class="gallery-item"><a href="images/full/018.jpg"><img src="images/thumb/018.jpg" alt="Image 018" /></a></div>
	
		</div>
	
	</div>
	
	
</div>	

	
<div id="Footer">
	<p><small>&copy; 2011 Code Computerlove Ltd - new media agency / digital marketing agency</small></p>

	<div id="SocialLinks">
	<a href="http://blog.codecomputerlove.com/"><img src="images/blogicon.png" width="32" height="32" alt="Blog" /></a>
	<a href="http://www.twitter.com/computerlovers"><img src="images/twittericon.png" width="32" height="32" alt="Twitter" /></a>
	<a href="http://www.facebook.com/CodeComputerlove"><img src="images/facebookicon.png" width="32" height="32" alt="Facebook" /></a>
	<a href="http://www.flickr.com/photos/codecomputerlove"><img src="images/flickricon.png" width="32" height="32" alt="Flickr" /></a>
</div>

</body>
</html>